import React from 'react'
import Swiper from 'react-id-swiper'

import Title from '../../components/Title'
import BuyBar from '../../components/BuyBar'

import 'swiper/css/swiper.min.css';
import './style.css'


const params = {
    pagination: {
        el: '.swiper-pagination',
        type: 'fraction',
    },
}

class Index extends React.Component {
    render() {
        return (
            <div className='commodityInfo'>
                <Title title='商品详情' />
                            
                <Swiper {...params}>
                    <div>
                        <img src='https://xinglong.tech/logo.jpg' />
                    </div>
                    <div>
                        <img src='https://xinglong.tech/logo.jpg' />
                    </div>
                    <div>
                        <img src='https://xinglong.tech/logo.jpg' />
                    </div>
                    <div>
                        <img src='https://xinglong.tech/logo.jpg' />
                    </div>
                </Swiper>

                <div className='commodityInfo-details'>
                    <div className='commodityInfo-details_money'>
                        ¥: 99.99
                    </div>
                    <div className='commodityInfo-details_title' >
                        IT 外包
                    </div>
                    <div className='commodityInfo-details_deliver'>
                        <div>
                            发货
                        </div>
                        <div 
                            className='details'
                        >
                            <div>快递方式</div>
                            <div>付款后48小时发货</div>
                        </div>
                    </div>
                    <div className='commodityInfo-other'>
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                        产品详情<br />
                    </div>
                </div>
                <BuyBar />
            </div>
        )
    }
}

export default Index
